
class popup {
    constructor() {
        this.init();
    }
}
$.extend(popup.prototype, {
    init: function () {
        this.header = $('.header');
        //聚美菜单
        this.itemIjumei = $('.my-jumei');
        this.myJumei = $('.jumei-list');

        //更多菜单
        this.itemMore = $('.more');
        this.myMore = $('.more-list');
        //购物车菜单
        this.carts = $('.header-center-carts');
        this.cartsContents = $('.carts-contents');
        //美妆商城
        this.beauty = $('.beauty-shop');
        this.beautyList = $('.beauty-shop-list');
        this.itemIjumei.on('mouseover', $.proxy(function () {
            this.listAppear('jumei');
        }, this));
        this.itemMore.on('mouseover', $.proxy(function () {
            this.listAppear('more');
        }, this));
        this.carts.on('mouseover', $.proxy(function () {
            this.listAppear('carts');
        }, this));
        this.beauty.on('mouseover', $.proxy(function () {
            this.listAppear('beauty');
        }, this));
        this.itemIjumei.on('mouseout', $.proxy(function () {
            this.listDisappear('jumei');
        }, this));
        this.itemMore.on('mouseout', $.proxy(function () {
            this.listDisappear('more');
        }, this));
        this.carts.on('mouseout', $.proxy(function () {
            this.listDisappear('carts');
        }, this));
        this.beauty.on('mouseout', $.proxy(function () {
            this.listDisappear('beauty');
        }, this));
    },
    listAppear: function (choose) {
        if (choose === 'jumei') {
            this.removeClassname(this.myJumei[0], ' unactive');
            this.myJumei[0].className += ' active';
        }
        else if (choose === 'more') {
            this.removeClassname(this.myMore[0], ' unactive');
            this.myMore[0].className += ' active';
        }
        else if (choose === 'carts') {
            this.removeClassname(this.cartsContents[0], ' unactive');
            this.cartsContents[0].className += ' active';
        }
        else if (choose === 'beauty') {
            this.removeClassname(this.beautyList[0], ' unactive');
            this.beautyList[0].className += ' active';

        }

    },
    listDisappear: function (choose) {
        if (choose === 'jumei') {
            this.removeClassname(this.myJumei[0], ' active');
            this.myJumei[0].className += ' unactive';
        }
        else if (choose === 'more') {
            this.removeClassname(this.myMore[0], ' active');
            this.myMore[0].className += ' unactive';
        }
        else if (choose === 'carts') {
            this.removeClassname(this.cartsContents[0], ' active');
            this.cartsContents[0].className += ' unactive';
        }
        else if (choose === 'beauty') {
            this.removeClassname(this.beautyList[0], ' active');

            this.beautyList[0].className += ' unactive';
        }
    },
    removeClassname: function (ele, state) {
        return ele.className = ele.className.replace(new RegExp("\S?" + state), "");
    }

})
export default popup;







// //我的聚美优品
// let itemIjumei = document.querySelector('.my-jumei');
// //我的收藏
// let itemMore = document.querySelector('.more');
// let myJumei = document.querySelector('.jumei-list');
// let myMore = document.querySelector('.more-list');
// let carts = document.querySelector('.header-center-carts');
// let cartsContents = document.querySelector('.carts-contents');
// //beauty-shop-list
// let beauty = document.querySelector('.beauty-shop');
// let beautyList = document.querySelector('.beauty-shop-list');
// let headerBottom = document.querySelector('.header-bottom');
// itemIjumei.addEventListener('mouseover', listAppear.bind(this, 'jumei'));
// itemMore.addEventListener('mouseover', listAppear.bind(this, 'more'));
// itemIjumei.addEventListener('mouseout', listDisappear.bind(this, 'jumei'));
// itemMore.addEventListener('mouseout', listDisappear.bind(this, 'more'));
// //
// carts.addEventListener('mouseover', listAppear.bind(this, 'carts'));
// carts.addEventListener('mouseout', listDisappear.bind(this, 'carts'));
// $('.header-bottom').on('mouseover', $('.beauty-shop'), $.proxy(() => {
//     listAppear('beauty');
// }, this));
// $('.header-bottom').on('mouseout', $('.beauty-shop'), $.proxy(() => {
//     listDisappear('beauty');
// }, this));

// function listAppear(choose) {
//     if (choose === 'jumei') {
//         removeClassname(myJumei, ' unactive');
//         myJumei.className += ' active';
//     }
//     else if (choose === 'more') {
//         removeClassname(myMore, ' unactive');
//         myMore.className += ' active';
//     }
//     else if (choose === 'carts') {
//         removeClassname(cartsContents, ' unactive');
//         cartsContents.className += ' active';
//     }
//     else if (choose === 'beauty') {
//         removeClassname(beautyList, ' unactive');
//         beautyList.className += ' active';
//     }

// }
// function listDisappear(choose) {
//     if (choose === 'jumei') {
//         removeClassname(myJumei, ' active');
//         myJumei.className += ' unactive';
//     }
//     else if (choose === 'more') {
//         removeClassname(myMore, ' active');
//         myMore.className += ' unactive';
//     }
//     else if (choose === 'carts') {
//         removeClassname(cartsContents, ' active');
//         cartsContents.className += ' unactive';
//     }
//     else if (choose === 'beauty') {
//         removeClassname(beautyList, ' active');
//         beautyList.className += ' unactive';
//     }
// }
// function removeClassname(ele, state) {
//     return ele.className = ele.className.replace(new RegExp("\S?" + state), "");
// }
// module.exports;